<template>
    <div style="width:999px;">
        <div style="width:100%;height:24px;margin-top:10px;margin-bottom:10px;">
            <h4 style="font-size: 24px;line-height: 24px;font-weight: 400;float:left;color: #222;">最近更新</h4>
        </div>
        <div style="width:calc(25% - 10px);height:80px;float:left;margin:10px 10px 10px 0px">
            <div class="xinfan-gengxin-img" v-bind:style='{"background-image":"url("+res[0].imgBase64+")"}' >
            </div>
            <div class="xinfan-gengxin-title">
                <el-link :underline="false" style="margin-top:0px !important;">神推偶像登上武道馆我就死而无憾</el-link>
            </div>

            <div class="xinfan-gengxin-jindu">
                <span style="font-size:12px;line-height:12px;color:#aaaaaa;">更新至</span>
                <a>8话</a>
            </div>
        </div>

        <div style="width:calc(25% - 10px);height:80px;float:left;margin:10px 10px 10px 0px">
            <div class="xinfan-gengxin-img" v-bind:style='{"background-image":"url("+res[0].imgBase64+")"}' >
            </div>
            <div class="xinfan-gengxin-title">
                <el-link :underline="false" style="margin-top:0px !important;">神推偶像登上武道馆我就死而无憾</el-link>
            </div>

            <div class="xinfan-gengxin-jindu">
                <span style="font-size:12px;line-height:12px;color:#aaaaaa;">更新至</span>
                <a>8话</a>
            </div>
        </div>

        <div style="width:calc(25% - 10px);height:80px;float:left;margin:10px 10px 10px 0px">
            <div class="xinfan-gengxin-img" v-bind:style='{"background-image":"url("+res[0].imgBase64+")"}' >
            </div>
            <div class="xinfan-gengxin-title">
                <el-link :underline="false" style="margin-top:0px !important;">神推偶像登上武道馆我就死而无憾</el-link>
            </div>

            <div class="xinfan-gengxin-jindu">
                <span style="font-size:12px;line-height:12px;color:#aaaaaa;">更新至</span>
                <a>8话</a>
            </div>
        </div>

        <div style="width:calc(25% - 10px);height:80px;float:left;margin:10px 10px 10px 0px">
            <div class="xinfan-gengxin-img" v-bind:style='{"background-image":"url("+res[0].imgBase64+")"}' >
            </div>
            <div class="xinfan-gengxin-title">
                <el-link :underline="false" style="margin-top:0px !important;">神推偶像登上武道馆我就死而无憾</el-link>
            </div>

            <div class="xinfan-gengxin-jindu">
                <span style="font-size:12px;line-height:12px;color:#aaaaaa;">更新至</span>
                <a>8话</a>
            </div>
        </div>

        <div style="width:calc(25% - 10px);height:80px;float:left;margin:10px 10px 10px 0px">
            <div class="xinfan-gengxin-img" v-bind:style='{"background-image":"url("+res[0].imgBase64+")"}' >
            </div>
            <div class="xinfan-gengxin-title">
                <el-link :underline="false" style="margin-top:0px !important;">神推偶像登上武道馆我就死而无憾</el-link>
            </div>

            <div class="xinfan-gengxin-jindu">
                <span style="font-size:12px;line-height:12px;color:#aaaaaa;">更新至</span>
                <a>8话</a>
            </div>
        </div>
<!--        <div style="width:calc(25% - 10px);height:100px;background-color:green;float:left;margin:10px 10px 10px 0px">最近更新</div>-->
<!--        <div style="width:calc(25% - 10px);height:100px;background-color:green;float:left;margin:10px 10px 10px 0px">最近更新</div>-->
<!--        <div style="width:calc(25% - 10px);height:100px;background-color:green;float:left;margin:10px 10px 10px 0px">最近更新</div>-->
<!--        <div style="width:calc(25% - 10px);height:100px;background-color:green;float:left;margin:10px 10px 10px 0px">最近更新</div>-->
<!--        <div style="width:calc(25% - 10px);height:100px;background-color:green;float:left;margin:10px 10px 10px 0px">最近更新</div>-->
<!--        <div style="width:calc(25% - 10px);height:100px;background-color:green;float:left;margin:10px 10px 10px 0px">最近更新</div>-->
<!--        <div style="width:calc(25% - 10px);height:100px;background-color:green;float:left;margin:10px 10px 10px 0px">最近更新</div>-->
<!--        <div style="width:calc(25% - 10px);height:100px;background-color:green;float:left;margin:10px 10px 10px 0px">最近更新</div>-->
<!--        <div style="width:calc(25% - 10px);height:100px;background-color:green;float:left;margin:10px 10px 10px 0px">最近更新</div>-->
<!--        <div style="width:calc(25% - 10px);height:100px;background-color:green;float:left;margin:10px 10px 10px 0px">最近更新</div>-->
<!--        <div style="width:calc(25% - 10px);height:100px;background-color:green;float:left;margin:10px 10px 10px 0px">最近更新</div>-->
<!--        <div style="width:calc(25% - 10px);height:100px;background-color:green;float:left;margin:10px 10px 10px 0px">最近更新</div>-->

    </div>
</template>

<script>
    export default {
        name: "xinfanGengxin",
        data(){
          return{
              paigangbangForm:{
                  fenquParent:'',
                  is1day:'1',
                  is3day:'0',
                  is7day:'0'
              },
              res:[]
          }
        },
        created(){
            var self = this;
            self.paigangbangForm.fenquParent = "01-fanju";
            //查找动漫区前11的视频
            self.$api.post('paihangbang/getPaihangbangTop11',self.paigangbangForm, result => {
                self.res = result;
            });
        }
    }
</script>

<style scoped>
    .xinfan-gengxin-img{
        width:72px;
        height:72px;
        border-radius: 4px;
        float:left;
    }

    .xinfan-gengxin-title{
        width:120px;
        height:50px;
        float:left;
        padding-left:10px;
    }

    .xinfan-gengxin-jindu{
        width:120px;
        height:20px;
        float:left;
        padding-left:10px;
    }


    .xinfan-gengxin-jindu a {
        background: #b8c0cc;
        border-radius: 9px;
        /*vertical-align: top;*/
        text-align: center;
        padding: 0 6px;
        height: 12px;
        line-height: 12px;
        font-size:12px;
        min-width: 28px;
        max-width: 80px;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        overflow: hidden;
        color: #fff;
        /*margin-left: 5px;*/
    }
</style>
